<template>
	<view class="placeDetail">
		<view>
			<view class="flexJusp"
				style="background: #FFFFFF;box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0,0,0,0.04);border-radius: 16rpx 16rpx 0rpx 0rpx;margin:20rpx 20rpx 0rpx;padding:16rpx 22rpx 16rpx 18rpx;align-items: center;">
				<view class="flex" style="align-items: center;" v-if="!currentleimu || currentleimu.kind =='其他'">
					<image style="width: 60rpx;height: 60rpx;" :src="currentleimu.img"></image>
					<view style="font-weight: bold;margin-left:16rpx;font-size: 31rpx;">其他</view>
					<input v-model="currentleimu.name"
						style="height:36rpx;font-size:26rpx;width:240rpx;margin-left:12rpx;" placeholder="(请输入商品类目)" />
				</view>
				<view class="flex" style="align-items: center;" v-else>
					<image style="width: 80rpx;height: 80rpx;" :src="currentleimu.img"></image>
					<view style="font-weight: bold;margin-left:16rpx;font-size: 31rpx;">{{ currentleimu.kind }}</view>
				</view>
				<view class="flex"
					style="align-items: center;border-radius: 12rpx;border: 2rpx solid #d4d4d4;padding:9rpx 9rpx;"
					@click="leimus">
					<view style="margin-right:16rpx;font-size: 26rpx;">重新选择类目</view>
					<image style="width:26rpx;height:14rpx;" src="/static/image/03_1rtt.png"></image>
				</view>
			</view>
			<view style="background: #fff;margin: 0rpx 20rpx;">
				<view style="border-top:2rpx solid #F0F0F0;margin: 0rpx 40rpx 0rpx 40rpx;"></view>
			</view>
			<view class="flexJusp"
				style="background: #FFFFFF;box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0,0,0,0.04);border-radius: 0rpx 0rpx 16rpx 16rpx;margin:0rpx 20rpx 16rpx;padding:16rpx 22rpx 16rpx 18rpx;align-items: center;">
				<view class="flex" style="align-items: center;">
					<image v-if="index==0" style="width: 80rpx;height: 80rpx;" src="/static/image/03_wd.png"></image>
					<image v-if="index==1 || index==4" style="width: 80rpx;height: 80rpx;"
						src="/static/image/03_gbgg.png"></image>
					<image v-if="index==2" style="width: 80rpx;height: 80rpx;" src="/static/image/03_tyjh.png"></image>
					<image v-if="index==3" style="width: 80rpx;height: 80rpx;" src="/static/image/e.png"></image>
					<view style="font-weight: bold;margin-left:16rpx;font-size: 31rpx;">{{ array[moshi - 1] }}</view>
				</view>
				<view @tap="tap">
					<picker @change="bindPickerChange" :value="moshi -1" :range="array" :disabled="disableChange">
						<view class="flex"
							style="align-items: center;border-radius: 12rpx;border: 2rpx solid #d4d4d4;padding:9rpx 9rpx;">
							<view style="margin-right:16rpx;font-size: 26rpx;">重新选择下单模式</view>
							<image style="width:26rpx;height:14rpx;" src="/static/image/03_1rtt.png"></image>
						</view>
					</picker>
				</view>

			</view>
			<view>
				<view v-for="(item,index) in list" :key="index"
					style="background: #FFFFFF;box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0,0,0,0.04);border-radius: 16rpx;padding:20rpx 20rpx 28rpx;margin:0 20rpx 16rpx;">
					<view class="flexJusp">
						<view style="font-weight: bold;font-size: 33rpx;">商品信息</view>
						<view class="flex" style="align-items: center;">
							<view style="font-size: 33rpx;margin-right:12rpx;letter-spacing: 9rpx;">第{{ index + 1 }}组
							</view>
							<image @click="delect(index)" style="width:33rpx;height:33rpx;"
								src="/static/image/03_1bvg.png" v-if="!disableChange"></image>
						</view>
					</view>
					<view class="flex" style="margin-top:20rpx;flex-wrap: wrap;">
						<image @click="upImage(index)"
							style="width:146rpx;height:146rpx;margin-top:16rpx;margin-right: 20rpx;"
							:src="item.img||'/static/image/03_1ed.png'"></image>
						<view v-for="(items,indexs) in item.huanimgList" :key="indexs"
							style="width:146rpx;height:146rpx;margin-right:20rpx;position: relative;margin-top: 16rpx;">
							<image style="width:146rpx;height:146rpx;" :src="items"></image>
							<image @click="deleteGood(index,indexs)"
								style="width:32rpx;height:32rpx;position: absolute;top:-12rpx;right:-12rpx;"
								src="/static/image/03_4dfbd.png" v-if="!disableChange"></image>
						</view>

						<image v-if="item.huanimgList.length<4" @click="upImages(index)"
							style="width:146rpx;height:146rpx;margin-top: 16rpx;" src="/static/image/03_1xcvfd.png">
						</image>
					</view>
					<view class="flexJusp" @click="popupx(index)"
						style="height:104rpx;align-items: center;margin:20rpx 0 0;border-top:2rpx solid #F0F0F0;">
						<view>
							<text style="color: #E90000;font-size: 30rpx;">*</text>
							选择商品
						</view>
						<view v-if="!currentleimu || currentleimu.name =='其他'">
							<input disabled="disabled" v-model="item.goodsname"
								style="font-size:28rpx;height:40rpx;text-align: right;" placeholder="请输入商品类型" />
						</view>
						<view v-else class="flex" style="align-items: center;">
							<view style="color: #bbb;margin-right:16rpx;">{{ item.goodsname || '商品类型' }}</view>
							<image style="height:24rpx;width:12rpx;" src="/static/image/03_1ikj.png"></image>
						</view>
					</view>
					<view class="flexJusp" style="height:104rpx;align-items: center;border-top:2rpx solid #F0F0F0;">
						<view>
							<text style="color: #E90000;font-size: 30rpx;">*</text>
							商品数量
						</view>
						<view class="flex" style="align-items: center;border:2rpx solid #F0F0F0;height: 50rpx;">
							<view @click="shuliang('jian',index, item)"
								style="color: #CACACA;width:40rpx;text-align: center;">-
							</view>
							<view
								style="border-right:2rpx solid #F0F0F0;border-left:2rpx solid #F0F0F0;min-width:40rpx;font-size:24rpx;text-align: center;">
								{{ item.number }}
							</view>
							<view @click="shuliang('jia',index, item)" style="width:40rpx;text-align: center;">+</view>
						</view>
					</view>
					<view class="flexJusp" style="height:104rpx;align-items: center;border-top:2rpx solid #F0F0F0;">
						<view>
							<text style="color: #E90000;font-size: 30rpx;">*</text>
							服务项目
						</view>
						<view v-if="!currentleimu || currentleimu.name =='其他'">
							<input v-model="item.xiangmu" style="font-size:28rpx;height:40rpx;text-align: right;"
								placeholder="请输入服务项目" />
						</view>
						<view v-else class="flex" style="align-items: center;" @click="popups(index)">
							<view style="color: #bbb;margin-right:16rpx;">{{ item.xiangmu || '服务项目' }}</view>
							<image style="height:24rpx;width:12rpx;" src="/static/image/03_1ikj.png"></image>
						</view>
					</view>
					<view style="border-top:2rpx solid #F0F0F0;">
						<view style="padding:32rpx 0 16rpx;">商品备注</view>
						<textarea v-model="item.beizhu"
							style="width: 630rpx;height: 112rpx;background: #f5f5f5;border-radius: 16rpx;padding:18rpx 20rpx;font-size: 26rpx;color: #a2a2a2;"
							:disabled="disableChange" placeholder="请输入备注信息"></textarea>
					</view>

					<view v-if="item.sumprice"
						style="text-align: right;display: flex; padding: 0rpx 20rpx; margin-left: 550rpx; margin-top: 26rpx;">
						<view style=" display: flex;" v-if="item.sumprice !=0">
							<view style="color: #30a6f6; font-size: 28rpx; margin-top: -2rpx;">￥</view>
							<view style="color: #30a6f6; font-size: 28rpx; margin-top: 1rpx;">{{ item.sumprice }}</view>
						</view>
					</view>
				</view>
			</view>
			<!-- list数组里面的价格 -->
			<view class="flexJusp" v-if="list.length > 1"
				style="background: #FFFFFF;border-radius: 16rpx;margin:0 20rpx 16rpx;padding:26rpx 24rpx 26rpx 20rpx;font-size: 30rpx;">
				<view style="display: flex;">
					<view>共{{ list.length }}组商品</view>
				</view>
				<view class="money" v-if="price >0" style="display: flex;">
					<view>价格：</view>
					<view style="color: #30a6f6; font-size: 28rpx; margin-top: -2rpx;">￥</view>
					<view style="color: #30a6f6; font-size: 28rpx; margin-top: 1rpx;">{{ price }}</view>
				</view>
			</view>

			<uni-popup ref="popup" type="bottom" @touchmove.stop.prevent="preventHandler">
				<view style="padding:24rpx 20rpx;background: #FFFFFF;border-radius: 36rpx 36rpx 0rpx 0rpx;">
					<view class="flexJusp" style="margin-bottom:24rpx;">
						<view style="font-size: 30rpx;font-weight: bold;color: #000000;">选择服务项目</view>
						<image @click="delects" style="width:36rpx;height:36rpx;" src="/static/image/03_4dfbd.png">
						</image>
					</view>
					<view class="flex" style="flex-wrap: wrap;">
						<view @click="qiehuan(index,item)" v-for="(item,index) in lists" :key="index"
							:style="{background:(moshi === 1 && !item.price || item.price <= 0)?'#EBEBEB':'white'}"
							:class="types===index?'xuanze':'weixuanze'">{{ item.kind }}
						</view>

					</view>
					<view class="flexJusp">
						<view class="buttonx" @click="delects">取消</view>
						<view class="buttons" @click="queding">确定</view>
					</view>
				</view>
			</uni-popup>
			<uni-popup ref="popupss" type="bottom" background-color="#fff" @touchmove.stop.prevent="preventHandler">
				<view style="padding:24rpx 20rpx;background: #FFFFFF;border-radius: 36rpx 36rpx 0rpx 0rpx;">
					<view class="flexJusp" style="margin-bottom:24rpx;">
						<view style="font-size: 30rpx;font-weight: bold;color: #000000;">选择商品</view>
						<image @click="delectspss" style="width:36rpx;height:36rpx;" src="/static/image/03_4dfbd.png">
						</image>
					</view>
					<view class="flex">

						<scroll-view
							style="width: 184rpx;height: 704rpx;background: #F2F8FE;border-radius: 10rpx 10rpx 0rpx 0rpx;"
							scroll-y="true">
							<view @click="qiehuans(index,item.kind)" v-for="(item,index) in goodlist" :key="index"
								:class="shangtype==index? 'xuanzes':'weixuanzes'">{{ item.kind }}
							</view>
						</scroll-view>
						<scroll-view style="height: 704rpx;width:506rpx;padding-left:20rpx;" scroll-y="true">
							<view @click="xuanze(item,index)" v-for="(item,index) in goodlist[shangtype].info"
								:key="index"
								:style="{background:(moshi === 1 && !item.hasPrice || item.hasPrice == 0)?'#EBEBEB':'white'}"
								:class="list[indexx].goodsId==item.id?'selected-item':'unselected-item'">
								<!-- style="width: 462rpx;border-radius: 12rpx;border: 2rpx solid #CCCCCC;padding:22rpx 18rpx;margin-bottom:24rpx;font-size: 26rpx;color: #666666;" -->

								{{ item.kind }}

							</view>
						</scroll-view>
					</view>
				</view>
			</uni-popup>
			<view style="height:env(safe-area-inset-bottom);"></view>
			<view class="post">
				<view class="flexJusp" style="">
					<view class="buttonx" @click="addList">继续添加商品</view>
					<view class="buttons" @click="nextStep">{{ index === 4 ? '完成' : '下一步' }}</view>
				</view>
				<view style="height:env(safe-area-inset-bottom);"></view>
			</view>
			<!-- 居中弹出二维码 -->
			<uni-popup ref="po" type="center" background-color="#fff">
				<view :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view class="popup-content_2">
						<view @tap="Customer_close('center')" style="margin-left: 420rpx; margin-top: 30rpx;">
							<uni-icons type="closeempty" size="20"></uni-icons>
						</view>
						<img class="imagess" v-if="images" :src="images" alt="小程序码" @longpress="saveImageToLocal">
						<view class="button_Save" @tap="saveImageToLocal">长按保存图片到相册</view>
					</view>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				indexx: -1,
				type: 0,
				types: 0,
				array: ['一口价下单', '报价下单', '悬赏下单', '分时零工'],
				index: 0, // 0为一口价，1为报价，2为悬赏，3为分时零工，4为替人下单
				couponNum: 0,
				moshi: 1,
				num: 1,
				shangtype: 0,
				list: [{
					img: '',
					huanimgList: [],
					goodsname: '',
					number: 1,
					xiangmu: '',
					beizhu: '',
					price: 0,
					sumprice: 0
				}],
				beizhu: '',
				title: '',
				lists: [],
				xiangmuList: [],
				goodlist: [{
					info: ''
				}],
				indexs: 0,
				indexx: 0,
				currentleimu: '',
				username: '',
				phone: '',
				address: '',
				addressdetail: '',
				couponsPrice: '',
				fentime: '',
				ordername: '',
				orderphone: '',
				qitime: '',
				couponsId: '',
				leimulist: [],
				price: 0, //价格
				priceindex: 0,
				images: '',
				scanOrderId: '',
				disableChange: false, // 控制picker的disabled属性
				actionTemplateId: null, //类目id和判断是否是推广
			};
		},
		onLoad(option) {
			if (option.actionTemplateId) {
				//如果推广
				this.actionTemplateId = option.actionTemplateId
				this.getActionTemplate()
			} else {
				if (option.type) {
					this.index = parseInt(option.type)
					this.moshi = this.index === 4 ? 2 : this.index + 1;
					if (this.index === 4) {
						this.array = ['一口价下单', '报价下单', '悬赏下单']
					}
				}

				// 二维码里传递过来的值
				if (option.scene) {
					this.disableChange = true;

					this.scanOrderId = option.scene
					this.scanOrder()
				}
				this.loads()
			}
		},
		methods: {
			preventHandler() {},
			coupon() {
				var that = this
				uni.navigateTo({
					url: '/pages/PlaceOrder/coupon/coupon?type=1&kind=2',
					events: {
						acceptDataFromOpenedPages: (data) => {
							that.couponNum = data.manprice
							that.couponsId = data.id
						},
					},
				})
			},

			xuanze(item, index) {

				// 相加
				if (this.moshi === 1 && !item.hasPrice || item.hasPrice === 0) {
					uni.showToast({
						title: '该商品暂无法使用一口价模式下单',
						duration: 1500,
						icon: 'none'
					});
					return
				}
				if (this.moshi === 1) {
					this.list[this.indexx].xiangmu = ''
					this.list[this.indexx].priceList = item.priceList
					this.list[this.indexx].price = 0
					this.refreshPrice()
				}
				this.list[this.indexx].goodsname = this.goodlist[this.shangtype].kind + '（' + item.kind + '）'
				this.list[this.indexx].goodsId = item.id
				this.list[this.indexx].goodstype = this.goodlist[this.shangtype].id
				this.$refs.popupss.close()
			},
			deleteGood(index, indexs) {
				this.list[index].huanimgList.splice(indexs, 1)
			},
			nextStep() {
				if (!this.list || this.list.length <= 0) {
					uni.showToast({
						title: '请选择或输入商品类型',
						duration: 1500,
						icon: 'none'
					});
					return
				}
				for (let i = 0; i < this.list.length; i++) {
					if (this.list[i].goodsname == '') {
						uni.showToast({
							title: '请选择或输入商品类型',
							duration: 1500,
							icon: 'none'
						});
						return
					} else if (this.list[i].xiangmu == '') {
						uni.showToast({
							title: '请选择或输入服务项目',
							duration: 1500,
							icon: 'none'
						});
						return
					}
				}
				if (this.currentleimu.name == '') {
					uni.showToast({
						title: '请选择或输入商品类目',
						duration: 1500,
						icon: 'none'
					});
					return
				}
				if (this.index !== 4) {
					if (this.scanOrderId) {
						uni.redirectTo({
							url: '/pages/PlaceOrder/confirmOrder/confirmOrder?id=' + this.scanOrderId +
								"&scan=true"
						})
						// this.bindorder()
					} else {
						uni.setStorageSync('list', this.list);
						uni.navigateTo({
							url: '/pages/PlaceOrder/confirmOrder/confirmOrder?limu=' + this.currentleimu.kind +
								'&moshi=' + this.moshi + '&price=' + this.price
						})
					}
				} else {
					this.qr_code()
				}
			},
			upImage(index) {
				if (this.disableChange) {
					uni.showToast({
						title: '不能更改图片',
						icon: 'none',
						duration: 2000
					});
					return
				}
				var that = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: function(res) {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							that.$upShop('upload', res.tempFilePaths[i]).then(rex => {
								let arr = JSON.parse(rex.data)
								that.list[index].img = arr.fileName
							})
						}
					}
				})
			},
			upImages(index) {
				if (this.disableChange) {
					uni.showToast({
						title: '不能更改图片',
						icon: 'none',
						duration: 2000
					});
					return
				}
				var that = this
				uni.chooseImage({
					count: 4 - that.list[index].huanimgList.length, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: function(res) {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							that.$upShop('upload', res.tempFilePaths[i]).then(rex => {
								let arr = JSON.parse(rex.data)
								that.list[index].huanimgList.push(arr.fileName)
							})
						}
					}
				})
			},
			leimus() {
				if (this.disableChange) {
					uni.showToast({
						title: '不能切换商品',
						icon: 'none',
						duration: 2000
					});
				} else {
					uni.navigateTo({
						url: '/pages/PlaceOrder/category/category',
						events: {
							acceptDataFromOpenedPages: (data) => {
								this.actionTemplateId = null //如果切换类目，则不再是推广
								this.currentleimu = data
								this.clearData()
								this.$httpapi('shoptype', 'POST', {
									id: this.currentleimu.id
								}).then(res => {
									this.goodlist = res.data
								})
							},
						},
					});
				}
			},
			qiehuans(index) {
				this.shangtype = index
			},
			queding() {
				this.list[this.indexs].xiangmu = this.lists[this.types].kind
				this.list[this.indexs].price = this.lists[this.types].price
				this.list[this.indexs].xiangmuid = this.lists[this.types].id
				this.list[this.indexs].xiangmutype = this.types

				this.refreshPrice()
				this.$refs.popup.close()
			},

			qiehuan(index, item) {

				if (this.moshi === 1 && !item.price || item.price <= 0) {
					uni.showToast({
						title: '该服务一口价暂未开放',
						duration: 1500,
						icon: 'none'
					});
					return
				}
				this.types = index
			},
			popups(index) {
				if (this.moshi === 1 && !this.list[index].goodsname) {
					uni.showToast({
						title: '一口价下单请先选择商品',
						duration: 1500,
						icon: 'none'
					});
					return
				}

				if (this.moshi !== 1) {
					this.lists = this.xiangmuList;
				} else {
					this.lists = this.list[index].priceList
					if (this.list[index].goodstype) {
						this.shangtype = this.goodlist.findIndex(goods => goods.id === this.list[index].goodstype)
						let serverType = this.goodlist[this.shangtype].info.findIndex(server => server.id === this.list[index].goodsId)
						this.lists = this.goodlist[this.shangtype].info[serverType].priceList
					} else {
						this.lists = this.list[index].priceList
					}
				}

				this.indexs = index
				if (this.list[index].xiangmutype) {
					this.types = this.list[index].xiangmutype;
				} else {
					this.types = 0
					if (this.moshi === 1) {
						for (let i = 0; i < this.lists.length; i++) {
							if (this.lists[i].price) {
								this.types = i;
								break;
							}
						}
					}
				}

				if (this.disableChange) {
					uni.showToast({
						title: '不能更改服务项目',
						icon: 'none',
						duration: 2000
					});
				} else {
					this.$refs.popup.open('bottom')
				}
			},
			popupx(index) {
				console.log(this.list[index])
				//判断是否是新商品
				if (this.list[index].goodstype) {
					this.shangtype = this.goodlist.findIndex(goods => goods.id === this.list[index].goodstype)
					this.indexx = this.goodlist[this.shangtype].info.findIndex(goods => goods.id === this.list[index].goodsId)
				} else this.shangtype = 0
				this.priceindex = index
				this.indexx = index
				if (this.disableChange) {
					uni.showToast({
						title: '不能更改商品类型',
						icon: 'none',
						duration: 2000
					});
				} else {
					this.$refs.popupss.open('bottom')
				}
			},
			delects() {
				this.$refs.popup.close()
			},
			delectspss() {
				this.$refs.popupss.close()
			},
			loads(id) {
				this.$httpapi('shoplimu', 'POST', {}).then(res => {
					this.leimulist = res.data
					//判断是否是推广
					if (id) {
						//是推广则将类目换成相应的
						this.currentleimu = res.data.find(item => item.id === id)
						if (!this.currentleimu) {
							this.currentleimu = res.data[0]
						}
					} else {
						this.currentleimu = res.data[0]
					}
					this.$httpapi('shoptype', 'POST', {
						id: this.currentleimu.id
					}).then(res => {
						this.goodlist = res.data
					})
				})
				this.$httpapi('xiangmu', 'POST', {}).then(res => {
					this.xiangmuList = res.data
				})
			},
			addList() {
				this.list.push({
					img: '',
					huanimgList: [],
					goodsname: '',
					number: 1,
					xiangmu: '',
					beizhu: '',
					price: 0
				})
			},
			delect(index) {
				// this.price = this.price - this.list[index].price
				this.price = this.price - this.list[index].sumprice
				this.list.splice(index, 1)
			},
			refreshPrice() {
				var price = 0;
				for (let i = 0; i < this.list.length; i++) {
					this.list[i].sumprice = this.list[i].price * parseInt(this.list[i].number)
					price = price + (this.list[i].price * parseInt(this.list[i].number))
				}
				if (this.moshi !== 1) {
					price = 0
				}
				this.price = price
			},
			shuliang(type, index, item) {
				if (this.disableChange) {
					uni.showToast({
						title: '不能更改商品数量',
						icon: 'none',
						duration: 2000
					});
					return
				}
				if (type === 'jia') {
					if (this.list[index].xiangmu) {
						this.list[index].number++
						let price = item.price * this.list[index].number
						this.list[index].sumprice = price
						this.price = 0
						this.list.forEach((item) => {
							this.price += item.sumprice
						})
					}

				} else if (type === 'jian') {
					if (this.list[index].number !== 1) {
						this.list[index].number--
						let price = item.price * this.list[index].number
						this.list[index].sumprice = price

						this.price = 0
						this.list.forEach((item) => {
							this.price += item.sumprice
						})
					}
				}
			},
			tap() {
				if (this.disableChange) {
					uni.showToast({
						title: '不能切换服务项目',
						icon: 'none',
						duration: 2000
					});
				}
			},
			bindPickerChange(e) {
				if (this.disableChange) {
					uni.showToast({
						title: '不能切换服务项目',
						icon: 'none',
						duration: 2000
					})
					return
				} else {
					this.moshi = parseInt(e.detail.value) + 1
					this.clearData()
				}
			},
			clearData() {
				// 清空默认 已选择
				this.shangtype = 0
				this.types = 0
				this.list = [{

					img: '',
					huanimgList: [],
					goodsname: '',
					number: 1,
					xiangmu: '',
					xiangmuid: 0,
					xiangmutype: '',
					beizhu: '',
					price: 0,
					sumprice: 0,
				}]
				this.price = 0
				// this.goodlist = [{
				// 	info: ''
				// }]
				//修改下单模式则不再是推广
				this.actionTemplateId = null

			},
			qr_code() {
				if (this.currentleimu.kind == '其他') {
					if (this.currentleimu.name == '') {
						this.currentleimu.name = '其他商品类目'
					}
				} else {
					this.currentleimu.name = this.currentleimu.kind
				}
				for (let i = 0; i < this.list.length; i++) {
					this.list[i].huanimg = this.list[i].huanimgList.toString()
				}
				this.refreshPrice()
				var xiangmuFlag = '';
				for (var _i = 0; _i < this.list.length; _i++) {
					if (_i === 0) xiangmuFlag += '[' + this.list[_i].xiangmuid + ']';
					else xiangmuFlag += ',[' + this.list[_i].xiangmuid + ']';
				}
				var arrdata = {
					limu: this.currentleimu.name,
					price: this.price,
					moshi: this.moshi,
					username: this.username,
					phone: this.phone,
					address: this.address,
					addressdetail: this.addressdetail,
					orderphone: this.orderphone,
					ordername: this.ordername,
					qitime: this.qitime,
					beizhu: this.beizhu,
					list: this.list,
					couponsId: this.couponsId,
					laxin: this.index === 4 ? 1 : 0,
					xiangmuflag: xiangmuFlag
				}

				// 打开二维码
				let that = this
				this.$httpapi('preorder', 'POST', arrdata).then(res => {
					that.scanOrderId = res.data
					uni.showLoading({
						title: '二维码生成中'
					});
					this.generateQRCode()
					this.$refs.po.open();
				})
			},
			generateQRCode() {
				let data = {
					scene: this.scanOrderId,
					page: `pages/PlaceOrder/placeOrderDetail/placeOrderDetail`,
				}
				this.$httpapi('consumerShareQR', 'POST', data).then(res => {
					// 隐藏加载框
					uni.hideLoading();
					// 将 arraybuffer 转换为 base64
					this.images = 'data:image/png;base64,' + res.data;
				})
			},
			// 二维码扫描之后
			scanOrder() {
				this.$httpapi('orderdetail', 'POST', {
					orderId: this.scanOrderId
				}).then(res => {
					if (res.data.openid && res.data.openid !== '') {
						this.$utils.showtt('该订单已被绑定')
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/index/index'
							})
						}, 1500); // 单位是毫秒
						return
					}
					this.detail = res.data;
					this.username = res.data.username
					this.phone = res.data.phone
					this.address = res.data.address
					this.addressdetail = res.data.addressdetail
					this.ordername = res.data.username
					this.orderphone = res.data.phone
					this.qitime = res.data.qitime
					this.price = res.data.price
					this.beizhu = res.data.beizhu
					this.moshi = res.data.moshi
					this.index = this.moshi - 1

					this.list = res.data.xiangmu
					for (var j = 0; j < this.list.length; j++) {
						if (this.list[j].huanimg) {
							this.list[j].huanimgList = this.list[j].huanimg.split(',');
						} else {
							this.list[j].huanimgList = []
						}
					}
				})
			},
			//推广来的
			getActionTemplate() {
				this.$httpapi('getActionTemplate', 'POST', {
					id: this.actionTemplateId
				}).then(res => {
					this.price = 0
					this.moshi = res.data.moshiId
					this.index = this.moshi - 1

					//如果商品为空
					if (res.data.goodsList.length == 0) {
						this.list = [{
							img: '',
							huanimgList: [],
							goodsname: '',
							number: 1,
							xiangmu: '',
							beizhu: '',
							price: '',
							sumprice: '',
							goodsId: '',
							xiangmuid: '',
							xiangmutype: '',

						}, ]
					} else {
						this.list = res.data.goodsList
						for (var j = 0; j < this.list.length; j++) {

							this.list[j].sumprice = parseInt(this.list[j].sumprice)
							this.list[j].price = this.list[j].sumprice / this.list[j].number
							this.price += this.list[j].sumprice

							this.list[j].xiangmuid = this.list[j].xiangmu
							this.list[j].xiangmutype = this.list[j].xiangmu - 2
							this.list[j].xiangmu = this.list[j].xiangmuName
							if (this.list[j].huanimg) {
								this.list[j].huanimgList = this.list[j].huanimg.split(',');
							} else {
								this.list[j].huanimgList = []
							}
						}
					}
					this.loads(res.data.leimuId)
				})
			},
			// 关闭
			Customer_close() {
				this.$refs.po.close()
			},
			// 保存在本地
			saveImageToLocal() {
				const base64Img = this.images.replace(/^data:image\/\w+;base64,/, '');
				uni.getSetting({
					success: (res) => {
						if (!res.authSetting['scope.writePhotosAlbum']) {
							// 用户未授权保存到相册
							uni.authorize({
								scope: 'scope.writePhotosAlbum',
								success: () => {
									this.saveImage(base64Img); // 已授权，则执行保存图片操作
								},
								fail: () => {
									uni.showToast({
										title: '未授权保存到相册,请点击左上角三个点进入设置页授予添加到相册权限',
										icon: 'none',
										duration: 1500
									});
								}
							});
						} else {
							uni.showToast({
								title: '进入长按图片到相册',
								icon: 'none',
								duration: 1500
							});
							setTimeout(() => {
								// 3秒后执行保存图片操作
								this.saveImage(base64Img);
							}, 1500); // 单位是毫秒
						}
					}
				});
			},
			saveImage(base64Img) {
				uni.getFileSystemManager().writeFile({
					filePath: `${wx.env.USER_DATA_PATH}/temp-image.png`,
					data: base64Img,
					encoding: 'base64',
					success: () => {
						uni.saveImageToPhotosAlbum({
							filePath: `${wx.env.USER_DATA_PATH}/temp-image.png`,
							success: () => {
								uni.showToast({
									title: '保存成功',
									icon: 'success',
									duration: 1500
								});
							},
							fail: (err) => {
								uni.showToast({
									title: '取消保存到本地',
									icon: 'none',
									duration: 1500
								});
							}
						});
					},
					fail: (err) => {
						uni.showToast({
							title: '保存失败',
							icon: 'none',
							duration: 1500
						});
					}
				});
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F7F6FA;
	}

	.placeDetail {
		color: #000000;
		padding-bottom: 120rpx;

		.post {
			position: fixed;
			bottom: 0;
			left: 0;
			z-index: 8;
			width: 710rpx;
			background-color: #FFF;
			color: #9EA3AE;
			font-size: 24rpx;
			padding: 16rpx 20rpx;
			box-shadow: 0px -4px 10px 0px rgba(0, 0, 0, 0.10);
			text-align: center;
			// padding: 50rpx 0rpx 0rpx 0rpx;

			.quantity_money {
				display: flex;
				position: absolute;
				right: 0;
				height: 100rpx;
				line-height: 100rpx;
				padding: 0rpx 20rpx;

				.quantity {
					font-size: 27rpx;
				}

			}
		}

		.uni-popup .uni-popup__wrapper {
			display: block;
			position: relative;
			border-radius: 12rpx;
			margin-top: -50rpx;
		}

		.popup-content_2 {
			width: 480rpx;
			height: 530rpx;
			border-radius: 10rpx;

			.imagess {
				width: 330rpx;
				height: 330rpx;
				margin: auto;
				display: flex;
				margin-top: 20rpx;
			}

			.button_Save {
				text-align: center;
				margin-top: 50rpx;
				font-size: 25rpx;
			}
		}


		.buttons {
			text-align: center;
			width: 344rpx;
			height: 86rpx;
			background: linear-gradient(180deg, #2089FF 0%, #11ACEF 100%);
			border-radius: 44rpx;
			font-size: 30rpx;
			color: #FFFFFF;
			line-height: 86rpx;
		}

		.buttonx {
			text-align: center;
			width: 344rpx;
			height: 86rpx;
			background: #FFFFFF;
			border-radius: 44rpx;
			border: 2rpx solid #2089FF;
			color: #2089FF;
			line-height: 86rpx;
		}


		/* 未选中样式 */
		.unselected-item {
			width: 462rpx;
			border-radius: 12rpx;
			border: 2rpx solid #CCCCCC;
			/* 未选中时的边框 */
			padding: 22rpx 18rpx;
			margin-bottom: 24rpx;
			font-size: 26rpx;
			color: #666666;
			/* 未选中时的文字颜色 */
		}


		/* 选中样式 */
		.selected-item {
			width: 462rpx;
			border-radius: 12rpx;
			border: 2rpx solid #2089FF;
			padding: 22rpx 18rpx;
			margin-bottom: 24rpx;
			font-size: 26rpx;
			color: #2089FF;
		}


		.xuanze {
			margin: 0 24rpx 24rpx 0;
			border-radius: 18rpx;
			border: 2rpx solid #2089FF;
			font-size: 28rpx;
			color: #1176EF;
			padding: 16rpx 52rpx;
		}

		.weixuanze {
			margin: 0 24rpx 24rpx 0;
			border-radius: 18rpx;
			border: 2rpx solid #999;
			font-size: 28rpx;
			color: #666;
			padding: 16rpx 52rpx;
		}

		.xuanzes {
			background-color: #FFF;
			text-align: center;
			font-size: 28rpx;
			color: #000000;
			padding: 20rpx 10rpx;
		}

		.weixuanzes {
			text-align: center;
			font-size: 28rpx;
			color: #000000;
			padding: 20rpx 10rpx;
		}

		.textareas {
			width: 630rpx;
			height: 38rpx;
			background: #F7F7F7;
			border-radius: 16rpx;
			padding: 22rpx 20rpx;
			font-size: 26rpx;
			line-height: 38rpx;
		}
	}
</style>